<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <form action="test.html">
        <!-- 下拉框 -->
        <!-- selected表示上来默认选择的选项 -->
        <!-- opgroup表示对下拉框进行分组 -->
        <select name="city">
            <optgroup label="一线城市">
                <option value="shanghai">上海</option>
                <option value="hangzhou">杭州</option>
                <option value="suzhou" selected>苏州</option>
            </optgroup>
            <!-- disabled表示禁用下拉列表 -->
            <optgroup label="二线城市" disabled>
                <option value="chongqin">重庆</option>
                <option value="xian">西安</option>
                <option value="minnan" selected>闽南</option>
            </optgroup>
        </select>
        <!--  多行文本框-->
        <textarea name="des" cols="30" rows="10"></textarea>
        <!-- filedset组件 -->
        <fieldset>
            <!-- <legend>请登录</legend> -->
            用户名: <input type="text">
            密码: <input type="password">
        </fieldset>
        <!-- 给输入框绑定待选项 -->
        <input type="text" list="fruit">
        <!-- h5新增表单元素 -->
        <datalist id="fruit">
            <option value="apple">苹果</option>
            <option value="banana">香蕉</option>
            <option value="apple">花牛水果</option>
            <option value="orange">橘子</option>
            <option value="fruit">葡萄</option>
        </datalist>
        <!-- 进度条 -->
        <progress value="50" max="100">
            50%
        </progress>
        <!-- 提交按钮 -->
        <!-- 邮箱 -->
        <input type="email" name="email" >
        <!-- 域名 -->
        <input type="url" name="url" >
        <!-- 数字 -->
        <input type="number" name="num" >
        <!-- 时间 -->
        <input type="date" name="date" >
        <!-- 颜色 -->
        <input type="color" name="color">

        <input type="submit" value="提交按钮">
    </form>
</body>

</html>